import React from 'react'
import { BrowserRouter as Router, Redirect, Route, NavLink, Switch } from 'react-router-dom';
import User from './User.js'
import Topics from './Topics.js'
import Article from './Article.js'
import Activity from './Activity.js'
import Book from './Book.js'
import Add from './Add.js'
import Addactivity from './Addactivity.js'

class Home extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
			res: [],
  	    };
    }
	componentDidMount() {
	}
    render () {
		return (
        <div>
			<div className='bijian-top-box'>🖊 &nbsp; 笔尖后台管理系统</div>
			<div className='bijian-left-box'>
				<ul>
					<li onClick={() =>{
						var x = document.getElementsByClassName("bijian-right-box");
						var i;
						for (i = 0; i < x.length; i++) {
						    x[i].style.display = "none";
						}
						document.getElementsByClassName('bijian-right-box')[0].style.display="block";
					}}>用户管理</li>
					<li onClick={() =>{
						var x = document.getElementsByClassName("bijian-right-box");
						var i;
						for (i = 0; i < x.length; i++) {
						    x[i].style.display = "none";
						}
						document.getElementsByClassName('bijian-right-box')[1].style.display="block";
					}}>随笔管理</li>
					<li onClick={() =>{
						var x = document.getElementsByClassName("bijian-right-box");
						var i;
						for (i = 0; i < x.length; i++) {
						    x[i].style.display = "none";
						}
						document.getElementsByClassName('bijian-right-box')[2].style.display="block";
					}}>文章管理</li>
					<li onClick={() =>{
						var x = document.getElementsByClassName("bijian-right-box");
						var i;
						for (i = 0; i < x.length; i++) {
						    x[i].style.display = "none";
						}
						document.getElementsByClassName('bijian-right-box')[3].style.display="block";
					}}>活动管理</li>
					<li onClick={() =>{
						var x = document.getElementsByClassName("bijian-right-box");
						var i;
						for (i = 0; i < x.length; i++) {
						    x[i].style.display = "none";
						}
						document.getElementsByClassName('bijian-right-box')[4].style.display="block";
					}}>书籍管理</li>
				</ul>
			</div>
			<div className='bijian-right-box' style={{display:'block'}}><User /></div>
			<div className='bijian-right-box'><Topics /></div>
			<div className='bijian-right-box'><Article /></div>
			<div className='bijian-right-box'><Activity /></div>
			<div className='bijian-right-box'><Book /></div>
			<div className='bijian-right-box'><Add /></div>
			<div className='bijian-right-box'><Addactivity /></div>
        </div>
    );
  }
}
export default Home